<template>
  <div class="my-4">
    <avue-form ref="form" v-model="form" :option="option" @submit="submit">
      <template slot="menuForm" slot-scope="{ size }">
        <!-- <el-button plain :size="size" @click="$refs.form.resetForm()">暂存</el-button> -->
        <el-button :size="size" @click="$emit('back')">取消</el-button>
        <el-button type="danger" :size="size" @click="reject">驳回</el-button>
        <el-button type="primary" :size="size" @click="approve">通过</el-button>
      </template>
    </avue-form>
  </div>
</template>

<script>
import { approveUpdate } from '@/api/chart/chart'

export default {
  name: 'ChartFormDetail',
  props: {
    detail: { type: Boolean, default: false },
    current: { type: Object, default: () => {} },
  },
  data() {
    return {
      loading: true,
      form: {},
      option: {
        detail: this.detail,
        submitBtn: false,
        emptyBtn: false,
        menuPosition: 'left',
        labelSuffix: ' ',
        group: [
          {
            label: '基本信息',
            arrow: false,
            prop: 'jbxx',
            column: [
              {
                label: '指标编码',
                prop: 'code',
                span: 12,
                // rules: [{ required: true, message: '请输入指标编码' }],
                disabled: true,
              },
              {
                label: '指标名称',
                prop: 'name',
                span: 12,
                // rules: [{ required: true, message: '请输入指标名称' }],
                disabled: true,
              },
              {
                label: '指标分类',
                prop: 'indexType',
                type: 'select',
                span: 12,
                // rules: [{ required: true, message: '请选择指标分类' }],
                dicUrl: '/api/sys/dict/list',
                props: {
                  label: 'dictValue',
                  value: 'dictValue',
                },
                dicMethod: 'post',
                dicQuery: {
                  dictTypeCode: 'martix_type',
                },
                disabled: true,
              },
              {
                label: '指标定义',
                prop: 'indexDefine',
                span: 12,
                // rules: [{ required: true, message: '请输入指标定义' }],
                disabled: true,
              },
              {
                label: '修订人',
                prop: 'reviser',
                type: 'select',
                span: 12,
                // rules: [{ required: true, message: '请选择修订人' }],
                disabled: true,
              },
              {
                label: '责任人',
                prop: 'director',
                type: 'select',
                span: 12,
                // rules: [{ required: true, message: '请选择责任人' }],
                dicUrl: '/api/user/userGrid/1/999',
                props: {
                  label: 'nickName',
                  value: 'userId',
                },
                dicMethod: 'post',
                dicFormatter: (res) => res.listObject,
                disabled: true,
              },
            ],
          },
          {
            label: '申请信息',
            arrow: false,
            prop: 'applyInfo',
            column: [
              // {
              //   label: '申请时效',
              //   prop: 'remark',
              //   type: 'select',
              //   dicData:[
              //     {label:'永久',value:'1'},
              //     {label:'选择时间',value:'2'},
              //   ],
              //   span: 8,
              //   row:true,
              //   control:(val)=>{
              //     let item = this.option.group[1].column[1]
              //     if(val==='2') {
              //       this.$set(item,'display',true)
              //     }else{
              //       this.$set(item,'display',false)
              //     }
              //   }
              // },
              // {
              //   prop:'time',
              //   type:'daterange',
              //   span:12,
              //   row:true,
              //   display:false
              // },
              {
                label: '申请人',
                prop: 'approveUserName',
                span: 12,
                disabled: true,
              },
              {
                label: '所属部门',
                prop: 'deptName',
                span: 12,
                disabled: true,
              },
              {
                label: '申请原因',
                prop: 'reason',
                type: 'textarea',
                disabled: true,
                span: 24,
              },
              {
                label: '审批意见',
                prop: 'approveRemark',
                type: 'textarea',
                span: 24,
                maxLength: 300,
                showWordLimit: true,
              },
            ],
          },
          {
            label: '审核结果',
            arrow: false,
            prop: 'approveInfo',
            display: this.detail,
            column: [
              {
                label: '申请时效',
                prop: 'remark',
                type: 'select',
                dicData: [
                  { label: '永久', value: '1' },
                  { label: '选择时间', value: '2' },
                ],
                span: 8,
                row: true,
                disabled: true,
              },
              {
                label: '审核意见',
                prop: 'remark',
                type: 'textarea',
                maxLength: 300,
                showWordLimit: true,
                span: 24,
                disabled: true,
              },
            ],
          },
        ],
      },
      isEdit: false,
    }
  },
  watch: {
    current: {
      deep: true,
      immediate: true,
      handler() {
        this.init()
      },
    },
  },
  created() {},
  methods: {
    approve() {
      this.form['approveStatus'] = '1'
      this.$refs.form.submit()
    },
    reject() {
      this.form['approveStatus'] = '2'
      this.$refs.form.submit()
    },
    async submit(_, done) {
      let { approveRemark, approveStatus } = this.form
      let id = this.$route.params.id
      approveUpdate({ approveRemark, approveStatus, id }).then((res) => {
        if (res.success) {
          this.$message.success(approveStatus === '1' ? '通过成功' : '驳回成功')
          this.$router.back()
        } else {
          this.$message.error(res.message)
        }
      })
      done()
    },
    async init() {
      if (this.$route.params.id) {
        this.loading = false
        this.isEdit = true
      } else {
        this.loading = false
        this.isEdit = false
      }
      this.form = { ...this.current }
      this.$set(this.option, 'detail', this.current.approveStatus !== '0')
    },
  },
}
</script>

<style lang="scss" scoped>
.chart-form-detail {
  background: #fff;
}
</style>
